<template>
  <div id="uesrtext">
    <textarea
        placeholder="按 Ctrl + Enter 发送"
        v-model="content"
        v-on:keyup="addMessage"></textarea>
  </div>
</template>

<script>
import {mapState} from 'vuex'

export default {
  name: 'uesrtext',
  data () {
    return {
      content:''
    }
  },
  computed: mapState([
    'users',
    'sessions',
    'currentSessionId',
    'currentAdmin'
  ]),
  methods: {
  	addMessage (e) {
  		if (e.ctrlKey && e.keyCode ===13 && this.content.length) {
        let msgObj = {};
        msgObj.to = this.currentSessionId.username;
        msgObj.from = this.currentAdmin.username;
        msgObj.content = this.content;
        // console.log(msgObj);
        this.$store.commit('addMessage',msgObj);
        //  /ws/chat
        this.$store.state.stomp.send('/queue/chat',{},JSON.stringify(msgObj));
        this.content='';
      }

  	}
  }
}
</script>

<style lang="css" scoped>
#uesrtext {
	position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 30%;
  border-top: solid 1px #DDD;

}
#uesrtext > textarea {
  padding: 10px;
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
}
</style>
